

let data = [{
    name : '网站工程',
    arr : [{
            name : '1906B',
            arr : [
                {
                    name : '张三'
                },{
                    name : '安其拉'
                }
            ]
        },{
            name : '1906C',
            arr : [
                {
                    name : '鲁班',
                },
                {
                    name : '东皇太一'
                }
            ]
        }
    ]
},
{
    name : '云计算',
    arr : [{
        name : '1906A',
        arr : [
            {
                name : '狄仁杰',
            },{
                name : '甄姬'
            }
        ]
    },
    {
        name : '1909A',
        arr : [
            {
                name : '第一组',
                arr : [{
                    name : 'aaa',
                },
                {
                    name : 'bbb',
                },
                {
                    name : 'ccc',
                },
                {
                    name : 'dd',
                }
            ]
            },{
                name : '甄姬3'
            }]
    }]
},{
    name : '传媒',
    arr : [{
        name : '1906A',
        arr : [
            {
                name : '狄仁杰',
            },{
                name : '甄姬'
            }
        ]
    },
    {
        name : '1909A',
        arr : [
            {
                name : '狄仁杰2',
            },{
                name : '甄姬3'
            }]
    }]
}
]
// 打印出学院的 名字 班级 学生名字
var s = each(data);
document.body.innerHTML = s;

function each(arr){
    let str = "<ul></ul>";
    arr.forEach(item => {
        str += `<li>${item.name}`;
        if(item.arr){
            str += `<ul>${each(item.arr)}</ul>`
        }
        str += '</li>';
    });
    str += '</ul>'
    return str;
}



// 添加点击事件
document.body.onclick = function(e){
    var tar = e.target;
    if(tar.tagName === 'LI'){
        var ul = tar.firstElementChild;
        ul && ul.classList.toggle('active');
            // classList  add(添加)  remove(删除) container(判断是否包含) toggle(切换)
    }
}